<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>css圆角阴影</title>
<!--[if lt IE 10]>
<script type="text/javascript" src="PIE.js"></script>
<![endif]-->
<script language="javascript">
$(function() {
    if (window.PIE) {
        $('.css3').each(function() {
        	//js添加的元素要调用PIE.attach(this)来添加解析
            PIE.attach(this);
            //添加解析后的元素被删除后要调用PIE.detach(this)
            //PIE.detach(this)
        });
    }
});
</script>
<style>
.yuan {
	position: relative;
	height: 100px;
	width: 100px;
	-moz-border-radius: 20px;
	-webkit-border-radius: 4px;
	border-radius: 50%;
	box-shadow: 0px 4px 5px #9C9C9C;
	behavior: url(\PIE.htc);
}
</style>

</head>

<body>
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan css3" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
 <img src="https://avatars2.githubusercontent.com/u/7285898?v=3&s=460" class="yuan" />
</body>
</html>
